<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title>QQ会员</title>

		<style type="text/css">

			*{

				margin: 0;

				padding: 0;

			}

			.h-head .h-head-container .h-head-list ul li{

				display: inline-block;

				list-style: none;

				margin: 0 10px;

			}

			.h-head .h-head-container .h-head-list ul li a{

				display: inline-block;

				text-decoration: none;

				color: #fff;

				list-style: none;

			}

			.h-head .h-head-container .h-head-list ul li a:hover{

				color: blue;

			}

			.h-head .h-head-container .h-head-container-logo{

				display: inline-block;

				width: 145px;

				height: 90px;

			}

			.h-head .h-head-container{

				width: 1140px;

				height: 90px;

				margin: 0 auto;

				background-color: #666;

				background-image: url(logo.png);

				background-repeat: no-repeat;

				background-size: 145px 90px;

				background-position: 38px 0;

			}

			.h-head-list{

				height: 34px;

				line-height: 90px;

				display: inline-block;

				margin-left: 224px;

			}

			.h-head-status{

				margin-top: 10px;

				display: inline-block;

			}			

			.h-head-status .h-head-status-userinfo{

				display: inline-block;

				font-size: 16px;

				font-weight: 400;

				border: 1px solid #FAD65C;

				border-radius: 30px;

				margin: 0 10px 0 20px;

				width: 80px;

				height: 30px;

				text-align: center;

				padding-top: 10px;

			}

			.h-head-status .h-head-status-btn{

				border: 1px solid #FAD65C;

				border-radius: 30px;

				width: 140px;

				height: 30px;

				text-align: center;

				padding-top: 10px;

				display: inline-block;

			}	

			.h-head-status-userinfo:hover,.h-head-status-btn:hover{

				background-color: #FAD65C;

			}

			img{

				display: inline-block;

				width:145px; 

				height:34px;

				margin-top: 30px;

				

			}

		</style>

	</head>

	<body>

		<header class="h-head">

			<div class="h-head-container">
				<li><img src="../img/logo.png"alt= </li>

				<nav class="h-head-list">

					<ul>
						
	
						<li><a href="#">功能特权</a></li>

						<li><a href="#">游戏特权</a></li>

						<li><a href="#">生活特权</a></li>

						<li><a href="#">会员活动</a></li>

						<li><a href="#">成长体系</a></li>

						<li><a href="#">年费专区</a></li>

						<li><a href="#">超级会员</a></li>

					</ul>

				</nav>

				<div class="h-head-status">

					<div class="h-head-status-userinfo">

						<span>登录</span>

					</div>

					<div class="h-head-status-btn">

						<span>开通超级会员</span>

					</div>

				</div>

			</div>

		</header>

	</body>

</html>

